<!-- 页面外套 -->
<div class="page-wrapper" id="personnel_attendance_days">
    
    <!-- 数据网格 -->
    <div class="datagrid datagrid-striped" id="personnel_attendance_days_datagrid">

        <!-- 工具条组 -->
        <div class="tool-group">
            <div class="tool-search">
                <div class="im-label">
                    <div class="input-group">
                        <select class="form-control" id="personnel_attendance_days_tool_keys">
                            <option value="1">姓名</option>
                            <option value="2">工号</option>
                        </select>
                        <span class="input-group-addon fix-border fix-padding"></span>
                        <input type="text" class="form-control" id="personnel_attendance_days_tool_search">
                    </div>
                </div>
                <label id="personnel_attendance_days_tool_select_group"><!--JS推进--></label>
                <label>
                    <span>在职状态：</span>
                    <select class="form-control" id="personnel_attendance_days_tool_select3"><!--JS推进--></select>
                </label>
                <div class="im-label" id="personnel_attendance_days_tool_date"><!--JS推进--></div>
                <label><button class="btn btn-primary" id="personnel_attendance_days_search_btn"><i class="icon icon-search"></i> 搜索</button></label>
                <div class="clearfix"></div>
            </div>
            <div class="tool-deal">
                <label><button class="btn btn-primary" id="personnel_attendance_days_export_btn"><i class="icon icon-external-link"></i> 导出</button></label>
                <div class="clearfix"></div>
            </div>
        </div>
        <!-- tool-group -->

        <div class="datagrid-container"></div>
        <ul class="pager btn-mini" data-elements="prev,pages,next"></ul>
    </div>
    <!-- datagrid -->

    <!-- 打卡结果-修改盒子 -->
    <div class="modal modal-for-page fade" aria-hidden="false" id="personnel_attendance_days_result_edit_box">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
                    <h4 class="modal-title">打卡结果修改</h4>
                </div>
                <div class="modal-body">
                    <form class="container form-horizontal">
                        <div class="form-group require">
                            <label class="col-sm-2 required" for="personnel_attendance_days_result_edit_type">类型：</label>
                            <div class="col-sm-7"><select class="form-control" id="personnel_attendance_days_result_edit_type"><!--JS推进--></select></div>
                        </div>
                        <div class="form-group require">
                            <label class="col-sm-2 required" for="personnel_attendance_days_result_edit_time">时间：</label>
                            <div class="col-sm-7">
                                <div class="input-group">
                                    <input class="form-control" id="personnel_attendance_days_result_edit_time">
                                    <span class="input-group-addon">分钟</span>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="personnel_attendance_days_result_edit_submit">提交</button>
                </div>
            </div>
        </div>
    </div>
    <!-- personnel_attendance_days_result_edit_box -->

</div>
<!-- page-wrapper -->

<script>
$(function(){

    //变量声明-----------------------------------------------------------------------------------------------
    var
    personnel_attendance_days                    = $("#personnel_attendance_days"),                     //页面ID
    personnel_attendance_days_datagrid           = $("#personnel_attendance_days_datagrid"),            //数据表格
    //搜索
    personnel_attendance_days_tool_keys          = $("#personnel_attendance_days_tool_keys"),           //搜索类别
    personnel_attendance_days_tool_search        = $("#personnel_attendance_days_tool_search"),         //搜索字段
    personnel_attendance_days_tool_select_group  = $("#personnel_attendance_days_tool_select_group"),   //下拉框组
    personnel_attendance_days_tool_select3       = $("#personnel_attendance_days_tool_select3"),        //下拉选择2
    personnel_attendance_days_tool_date          = $("#personnel_attendance_days_tool_date"),           //起止时间
    personnel_attendance_days_search_btn         = $("#personnel_attendance_days_search_btn"),          //搜索按钮
    personnel_attendance_days_export_btn         = $("#personnel_attendance_days_export_btn"),          //导出按钮
    //修改
    personnel_attendance_days_result_edit_box    = $("#personnel_attendance_days_result_edit_box"),     //修改盒子
    personnel_attendance_days_result_edit_type   = $("#personnel_attendance_days_result_edit_type"),    //修改类型
    personnel_attendance_days_result_edit_time   = $("#personnel_attendance_days_result_edit_time"),    //修改时间
    personnel_attendance_days_result_edit_submit = $("#personnel_attendance_days_result_edit_submit");  //修改提交

    //接口对象-----------------------------------------------------------------------------------------------
    if( window.STATE == "local" ){

        //本地接口
        var personnel_attendance_days_api = {
            datagrid  : LOCAL + "Test/Personnel/Attendance/days.json",                                      //数据表格
            select    : LOCAL + "Test/test_select.json",                                                    //下拉选择
        }

    } else if ( window.STATE == "route" ){

        //远程接口
        var personnel_attendance_days_api = {
            datagrid  : LOCAL + "Test/Personnel/Attendance/days.json",                                      //数据表格
            select    : LOCAL + "Test/test_select.json",                                                    //下拉选择
        }

    }

    //数据表格-----------------------------------------------------------------------------------------------
    personnel_attendance_days_datagrid.datagrid({
        height      : zui_datagrid_height(personnel_attendance_days_datagrid),
        headerHeight: 60,
        sortable    : false,
        cache       : false,
        showRowIndex: true,
        configs     : {
            R0:{className:"text-center"},
            C1:{className:"cell-hidden"}
        },
        states      : {
            fixedLeftUntil  : 3,
            pager           : {
                page        : 1,
                recPerPage  : window.REC_PER_PAGE,
            }
        },
        configs : {
            R0   : {className:"text-center th-line-height"},
            R0C8 : {colspan:2 },
            R0C10: {colspan:2 },
            R0C12: {colspan:2 },
            R0C14: {colspan:2 },
            R0C30: {colspan:10},
            R0C40: {colspan:3 },
        },
        dataSource : {
            cols   : [
                {html:true,width:49, name:"id",        label:"ID"  },
                {html:true,width:80, name:"user",      label:"姓名"},
                {html:true,width:80, name:"numb",      label:"工号"},
                {html:true,width:80, name:"depart",    label:"部门"},
                {html:true,width:80, name:"post",      label:"职位"},
                {html:true,width:140,name:"date",      label:"日期"},
                {html:true,width:160,name:"shift",     label:"班次"},
                {html:true,width:80, name:"work1_time",label:"<table class='th-table'><tr><td colspan='2'>上班1</td></tr><tr><td style='width:72px'>打卡时间</td><td>打卡结果</td></tr></table>"},
                {html:true,width:190,name:"work1_resu",label:"待合并",
                    valueOperator : {
                        getter : function(dataValue,cell){
                            return (dataValue.numb>8) ? `<a rowIndex='${cell.rowIndex}' colIndex="${cell.colIndex}" prefix='${dataValue.numb}' class='personnel_attendance_days_result_edit_btn'>${dataValue.text}</a>` : dataValue.text;
                        }
                    }
                },
                {html:true,width:80, name:"rest1_time",label:"<table class='th-table'><tr><td colspan='2'>下班1</td></tr><tr><td style='width:72px'>打卡时间</td><td>打卡结果</td></tr></table>"},
                {html:true,width:190,name:"rest1_resu",label:"待合并",
                    valueOperator : {
                        getter : function(dataValue,cell){
                            return (dataValue.numb>8) ? `<a rowIndex='${cell.rowIndex}' colIndex="${cell.colIndex}" prefix='${dataValue.numb}' class='personnel_attendance_days_result_edit_btn'>${dataValue.text}</a>` : dataValue.text;
                        }
                    }
                },
                {html:true,width:80, name:"work2_time",label:"<table class='th-table'><tr><td colspan='2'>上班2</td></tr><tr><td style='width:72px'>打卡时间</td><td>打卡结果</td></tr></table>"},
                {html:true,width:190,name:"work2_resu",label:"待合并",
                    valueOperator : {
                        getter : function(dataValue,cell){
                            return (dataValue.numb>8) ? `<a rowIndex='${cell.rowIndex}' colIndex="${cell.colIndex}" prefix='${dataValue.numb}' class='personnel_attendance_days_result_edit_btn'>${dataValue.text}</a>` : dataValue.text;
                        }
                    }
                },
                {html:true,width:80, name:"rest2_time",label:"<table class='th-table'><tr><td colspan='2'>下班2</td></tr><tr><td style='width:72px'>打卡时间</td><td>打卡结果</td></tr></table>"},
                {html:true,width:190,name:"rest2_resu",label:"待合并",
                    valueOperator : {
                        getter : function(dataValue,cell){
                            return (dataValue.numb>8) ? `<a rowIndex='${cell.rowIndex}' colIndex="${cell.colIndex}" prefix='${dataValue.numb}' class='personnel_attendance_days_result_edit_btn'>${dataValue.text}</a>` : dataValue.text;
                        }
                    }
                },
                {html:true,width:120,name:"item",label:"关联的审批单",
                    valueOperator : {
                        getter : function(dataValue,cell,dataGrid){
                            return `<a title="点击查看" data-toggle="modal" data-title="流水号：${dataValue.order}" data-custom="
                            <table class='table table-bordered table-striped'>
                                <tr><td>申请人</td><td>${dataValue.user}  </td></tr>
                                <tr><td>工号  </td><td>${dataValue.numb}  </td></tr>
                                <tr><td>部门  </td><td>${dataValue.depart}</td></tr>
                                <tr><td>原因  </td><td>${dataValue.reason}</td></tr>
                                <tr><td>时间  </td><td>${dataValue.date}  </td></tr>
                            </table>
                            ">${dataValue.order}</a>`;
                        }
                    }
                },
                {html:true,width:80, name:"work_day",   label:"出勤天数"      },
                {html:true,width:80, name:"rest_day",   label:"休息天数"      },
                {html:true,width:110,name:"work_min",   label:"工作时长(分钟)"},
                {html:true,width:80, name:"late",       label:"迟到次数"      },
                {html:true,width:110,name:"late_min",   label:"迟到时长(分钟)"},
                {html:true,width:110,name:"late_absent",label:"旷工迟到天数"  },                
                {html:true,width:100,name:"early",     label:"早退次数"       },
                {html:true,width:110,name:"early_min", label:"早退时长(分钟)" },
                {html:true,width:100,name:"absent",    label:"旷工天数"       },
                {html:true,width:110,name:"out_min",   label:"外出时长(分钟)" },
                {html:true,width:100,name:"out_day",   label:"出差天数"       },
                {html:true,width:100,name:"work_lack", label:"上班缺卡次数"   },
                {html:true,width:100,name:"rest_lack", label:"下班缺卡次数"   },
                {html:true,width:70, name:"asl1",//ask_for_leave
                    label : `
                        <table class='th-table'><tr><td colspan='10'>请假(小时)</td></tr>
                            <tr>
                                <td style="width:62px">年假</td>
                                <td style="width:70px">事假</td>
                                <td style="width:70px">病假</td>
                                <td style="width:70px">调休</td>
                                <td style="width:70px">产假</td>
                                <td style="width:70px">陪产假</td>
                                <td style="width:70px">婚假</td>
                                <td style="width:70px">丧假</td>
                                <td style="width:70px">哺乳假</td>
                                <td>其他</td>
                            </tr>
                        </table>
                    `
                },
                {html:true,width:70,name:"asl2",label:"待合并"},
                {html:true,width:70,name:"asl3",label:"待合并"},
                {html:true,width:70,name:"asl4",label:"待合并"},
                {html:true,width:70,name:"asl5",label:"待合并"},
                {html:true,width:70,name:"asl6",label:"待合并"},
                {html:true,width:70,name:"asl7",label:"待合并"},
                {html:true,width:70,name:"asl8",label:"待合并"},
                {html:true,width:70,name:"asl9",label:"待合并"},
                {html:true,width:70,name:"as10",label:"待合并"},
                {html:true,width:80,name:"add1",
                    label : `
                        <table class='th-table'><tr><td colspan='10'>加班时长-按加班规则计算(小时)</td></tr>
                            <tr>
                                <td style="width:72px">工作日加班</td>
                                <td style="width:80px">休息日加班</td>
                                <td>节假日加班</td>
                            </tr>
                        </table>
                    `
                },
                {html:true,width:80,name:"add2",label:"待合并"},
                {html:true,width:80,name:"add3",label:"待合并"}
            ],
            remote : function(){
                return {
                    url     : personnel_attendance_days_api.datagrid,
                    type    : "POST",
                    dataType: "json",
                }
            }
        },
        valueOperator : {
            string : {
                getter : function(dataValue,cell,dataGrid){
                    var resu = "";
                    ( dataValue=="0" ) ? resu="<span style='color:lightgrey'>"+dataValue+"</span>" : resu = dataValue;
                    return resu;
                }
            }
        }
    });//datagrid()

    //变量声明-----------------------------------------------------------------------------------------------
    var 
    personnel_attendance_days_datagrid_obj    = personnel_attendance_days_datagrid.data("zui.datagrid"),//表格对象
    personnel_attendance_days_result_edit_btn = ".personnel_attendance_days_result_edit_btn";           //修改按钮

    //时间组件-----------------------------------------------------------------------------------------------
    common_date_duration( personnel_attendance_days_tool_date );
    personnel_attendance_days_tool_date.find(".start").datetimepicker(option_date);
    personnel_attendance_days_tool_date.find(".end").datetimepicker(option_date);
    
    //下拉选项-----------------------------------------------------------------------------------------------
    common_select_linkage("#personnel_attendance_days_tool_select_group","1");                          //搜索

    //在职状态
    $.ajax({
        url     : personnel_attendance_days_api.select,
        type    : "post",
        dataType: "json",
        data    : {},
        success : function(data){
            if( data.status>0 ){
                var data = data.data;
                var option = "<option value='0'>全部</option>";
                for(var i=0;i<data.length;i++){
                    option += "<option value='"+data[i].id+"'>"+data[i].name+"</option>"
                }
                personnel_attendance_days_tool_select3.html(option);
            }
        }
    });

    //修改类型
    $.ajax({
        url     : personnel_attendance_days_api.select,
        type    : "post",
        dataType: "json",
        data    : {},
        success : function(data){
            var option = "<option value='0'>全部</option>";
            for(var i=0;i<data.length;i++){
                option += "<option value='"+data[i].id+"'>"+data[i].name+"</option>"
            }
            personnel_attendance_days_result_edit_type.html(option);
        }
    });

    //搜索按钮-----------------------------------------------------------------------------------------------
    personnel_attendance_days_search_btn.click(function(){

        //字段整理
        var keyword
        = "?sid="    + personnel_attendance_days_tool_keys.val()
        + "&search=" + personnel_attendance_days_tool_search.val()
        + "&depart=" + personnel_attendance_days_tool_select_group.find(".common_select_depart").val()
        + "&state =" + personnel_attendance_days_tool_select3.val()
        + "&date1="  + personnel_attendance_days_tool_date.find(".start").val()
        + "&date2="  + personnel_attendance_days_tool_date.find(".end").val();

        //GET提交
        zui_datagrid_render(personnel_attendance_days_datagrid_obj,personnel_attendance_days_api.datagrid+keyword);

    });

    //导出按钮-----------------------------------------------------------------------------------------------
    personnel_attendance_days_export_btn.click(function(){

        //远程提交
        $.ajax({
            url     : API.test_response,
            type    : "post",
            dataType: "json",
            data    : {
                keys    : personnel_attendance_days_tool_keys.val(),
                search  : personnel_attendance_days_tool_search.val(),
                depart  : personnel_attendance_days_tool_select_group.find(".common_select_depart").val(),
                state   : personnel_attendance_days_tool_select3.val(),
                date1   : personnel_attendance_days_tool_date.find(".start").val(),
                date2   : personnel_attendance_days_tool_date.find(".end").val(),
            },
            beforesend : function(){
                um_tip("导出中…");
            },
            success : function(data){
                if( data.status>0 ){
                    window.open(API.test_export);
                } else {
                    um_tip(data.message,"1500","text-danger");
                }
            }
        });
    });
    
    //修改按钮-----------------------------------------------------------------------------------------------
    $(document).on("click",personnel_attendance_days_result_edit_btn,function(){

        //数据获取
        var result_para = {
            rowIndex:$(this).attr("rowIndex"),
            colIndex:$(this).attr("colIndex"), 
            prefix  :$(this).attr("prefix")
        }

        //其他操作
        personnel_attendance_days_result_edit_submit.attr(result_para);     //数据传递
        personnel_attendance_days_result_edit_box.modal("show");            //面板显示

    });
    //修改提交-----------------------------------------------------------------------------------------------
    personnel_attendance_days_result_edit_submit.click(function(){
        
        //数据获取
        var result_para = {
            rowIndex:$(this).attr("rowIndex"),
            colIndex:$(this).attr("colIndex"), 
            prefix  :$(this).attr("prefix")
        }
        var data_id = zui_datagrid_get_id(result_para.rowIndex);            //数据ID
        var column  = "";                                                   //处理栏目
        switch ( result_para.colIndex ){
            case "9"  : column="上班1";break;
            case "11" : column="下班1";break;
            case "13" : column="上班2";break;
            case "15" : column="下班2";break;
        }
        var action = "";                                                    //具体操作
        switch( result_para.prefix ){
            case "9"  : action="缺卡";break;
            case "10" : action="早退";break;
            case "11" : action="迟到";break;
            case "12" : action="旷工迟到";break;
            case "13" : action="改为正常";break;
            case "14" : action="改为迟到";break;
            case "15" : action="改为旷工迟到";break;
            case "16" : action="改为缺卡";break;
            case "17" : action="改为早退";break; 
        }

        //数据取值
        var select1 = personnel_attendance_days_result_edit_type.val();
        var select3 = personnel_attendance_days_result_edit_time.val();

        //远程提交
        $.ajax({
            url     : API.test_response,
            type    : "post",
            dataType: "json",
            data    : {
                id      : data_id,                                          //数据ID
                column  : column,                                           //处理栏目
                action  : action,                                           //具体操作
                select1 : select1,                                          //修改类型
                select3 : select3,                                          //修改时间
            },
            success : function(data){
                if( data.status>0 ){
                    um_tip(data.message);
                    zui_datagrid_reset(personnel_attendance_days_datagrid_obj,personnel_attendance_days_api.datagrid);
                } else {
                    um_tip(data.message,"1500","text-danger");
                }
            }  
        });
    });

});//预加载结尾
</script>